<!--
 * @FileDescription: hr为未注册员工注册表单
 * @Author: 叶永鸿、袁年政
 * @Date: 2021-7-17
 * @LastEditors: 叶永鸿
 * @LastEditTime: 2021-7-18
 -->

<template>
  <div class="add_form">
    <el-card>
      <el-form
        ref="form"
        :model="form"
        label-width="80px"
        :rules="rules"
        class="demo-ruleForm"
      >
        <el-form-item label="员工姓名" prop="emploeeName">
          <el-input v-model="form.emploeeName" style="width: 65%"></el-input>
        </el-form-item>
        <el-form-item label="职位" prop="emploeePosition">
          <el-input
            v-model="form.emploeePosition"
            style="width: 65%"
          ></el-input>
        </el-form-item>

        <el-form-item label="员工生日" prop="emploeeBirth">
          <el-date-picker
            type="date"
            placeholder="选择日期"
            v-model="form.emploeeBirth"
            style="width: 40%"
            format="YYYY 年 MM 月 DD 日"
            value-format="YYYY-MM-DD"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="入职时间" required prop="emploeeRecruited">
          <el-date-picker
            type="date"
            placeholder="选择日期"
            v-model="form.emploeeRecruited"
            style="width: 40%"
            format="YYYY 年 MM 月 DD 日"
            value-format="YYYY-MM-DD"
          ></el-date-picker>
        </el-form-item>

        <el-form-item label="性别" prop="emploeeGender">
          <el-radio-group v-model="form.emploeeGender">
            <el-radio label="男"></el-radio>
            <el-radio label="女"></el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="年薪" prop="emploeeSalary">
          <el-input
            placeholder="请输入年薪"
            v-model.number="form.emploeeSalary"
            style="width: 35%"
          >
            <template #append>W</template>
          </el-input>
        </el-form-item>
        <el-form-item label="电话号码" prop="emploeeTel">
          <el-input v-model="form.emploeeTel" style="width: 65%"></el-input>
        </el-form-item>

        <el-form-item label="邮箱地址" prop="emploeeEmail">
          <el-input v-model="form.emploeeEmail" style="width: 65%"></el-input>
        </el-form-item>

        <el-form-item>
          <el-button @click="addSubmit('form')" type="primary"
            >添加员工</el-button
          >
          <el-button @click="resetForm('form')">清空</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>


<script>
export default {
  name: "add",
  data() {
    return {
      form: {
        emploeeName: "",
        emploeeGender: "",
        emploeeBirth: "",
        emploeeEmail: "",
        emploeeTel: "",
        emploeePosition: "",
        emploeeRecruited: "",
        emploeeSalary: "",
      },

      rules: {
        emploeeName: [
          { required: true, message: "请输入员工姓名", trigger: "blur" },
        ],
        emploeePosition: [
          { required: true, message: "请输入员工职位", trigger: "blur" },
        ],
        emploeeGender: [
          { required: true, message: "请选择性别", trigger: "change" },
        ],
        emploeeTel: [
          { required: true, message: "请输入员工电话号码", trigger: "blur" },

          {
            pattern:
              /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/,
            message: "手机号格式不对",
            trigger: "blur",
          },
        ],
        emploeeBirth: [
          {
            type: "date",
            required: true,
            message: "请选择出生日期",
            trigger: "change",
          },
        ],
        emploeeRecruited: [
          {
            type: "date",
            required: true,
            message: "请选择入职日期",
            trigger: "change",
          },
        ],
        emploeeSalary: [
          { required: true, message: "年薪不能为空" },
          { type: "number", message: "年薪必须为数字值" },
        ],
        emploeeEmail: [
          { required: true, message: "请输入邮箱", trigger: "blur" },
          {
            type: "email",
            message: "请输入正确的邮箱地址",
            trigger: ["blur", "change"],
          },
        ],
      },
    };
  },
  methods: {
    addSubmit(formName) {
      var that = this;
      /*var r = confirm("确认添加?")
        if (r == true) {
          // this.$axios.get("http://47.100.167.206:8082/Register/RegisterEmp?name="+this.emploeeName+"&gender="+this.emploeeGender+"&birth="+this.emploeeBirth+"&email="+this.emploeeEmail+"&telephone="+this.emploeeEmail)
          this.$axios.get("#?name="+this.emploeeName)
          .then(function(response){
            console.log(response);
          },function(err){
            alert("添加员工失败")
                      })
          } else {			
            alert("已经取消");
          }*/
      this.$refs[formName].validate((valid) => {
        if (valid) {
          var r = confirm("确认添加?");
          if (r == true) {
            this.$axios
              .get("http://47.100.167.206:8082/Register/RegisterEmp", {
                params: {
                  realname: this.form.emploeeName,
                  gender: this.form.emploeeGender,
                  birth: this.form.emploeeBirth,
                  email: this.form.emploeeEmail,
                  telephone: this.form.emploeeTel,
                  position: this.form.emploeePosition,
                  recruited: this.form.emploeeRecruited,
                  salary: this.form.emploeeSalary,
                },
                headers: {
                  token: this.$store.state.loginInfor.token,
                },
              })
              .then(
                function (response) {
                  console.log(response);
                  if (response.data.message == "successaddemployee") {
                    that.$message({
                      type: "success",
                      message: "成功添加",
                    });
                    form= {
                        emploeeName: "",
                        emploeeGender: "",
                        emploeeBirth:"",
                        emploeeEmail:"",
                        emploeeTel: "",
                        emploeePosition: "",
                        emploeeRecruited: "",
                        emploeeSalary: "",
                    };
                  }else if(response.data.message=="repeatedemail"){
                    that.$message({
                      type:"error",
                      message:"该邮箱已重复，请确认邮箱地址"
                    })
                  }else if(response.data.message=="telephonerepeated"){
                    that.$message({
                      type:"error",
                      message:"该手机号码已重复，请确认"
                    })
                  }
                },
                function (err) {
                  that.$message({
                      type:"error",
                      message:"网络请求失败，请重新登陆"
                    })
                }
              );
          } else {
            alert("已经取消");
          }
        } else {
          console.log("error submit!!");
        }
      });
    },
    resetForm(formName) {
      //重置表格
      this.$confirm("清空?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$refs[formName].resetFields();
        })
        .catch(() => {});
    },
  },
};
</script>

<style scoped>
.add_form {
  width: 50%;
  margin: 0 auto;
}
</style>

